<template>
  <div class="message">
    <div class="img">
      <!-- <img  class="image"  src="../../../../../assets/logo.png" alt="" /> -->
      <el-image class="image" :src="mydialogData.IMAGEURL" alt fit="contain" />
    </div>
    <div class="ifo">
      <div class="neirong">
        <div class="fontSize">
          发生时间：
          <span>{{mydialogData.GJSJ}}</span>
        </div>
        <div class="fontSize">
          变电站名称：
          <span>{{mydialogData.BDZMC}}</span>
        </div>
        <div class="fontSize">
          时间内容：
          <span>{{mydialogData.SJMS}}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue ,Prop} from "vue-property-decorator";

@Component
export default class extends Vue {
  @Prop() dialogData!: any;
  public url: any = require("@/assets/logo.png");
  get mydialogData(){
    return this.dialogData
  }
}
</script>

<style lang="scss" scoped>
.message {
  display: flex;
  line-height: 50%;
  width: 100%;
  height: 5rem;
  .img {
    flex: 2;
    .image {
      width: 100%;
      height: 100%;
      vertical-align: middle;
    }
  }
  .neirong{
    width: 100%;
  }
  .ifo {
    flex: 1;
    padding-left: 0.3rem;
    display: flex;
    align-items: center;
    .fontSize {
      font-size: 0.2rem;
      line-height: 0.5rem;
      border-bottom: 1px solid #fff;
      // &:nth-last-child(1) {
      //   // border-bottom: 0;
      // }
      span {
        font-size: 0.2rem;
      }
    }
  }
}
</style>
